<?php
use app\models\ArticleCategory;
use yii\helpers\ArrayHelper;
use yii\helpers\Html;

/**
 * @var $this yii\web\View
 * @var $table array 访问统计数据
 * @var $category array 分类访问统计数据
 */

app\assets\EchartsAsset::register($this);
app\assets\MaskedInputAsset::register($this);

$this->title = '资讯访问统计';
$this->params['breadcrumbs'][] = '统计分析';
$this->params['breadcrumbs'][] = $this->title;
?>
<?php echo Html::beginForm('?', 'get', ['class'=>'form-inline']);?>
<div class="form-group">
    <label for="search_date" class="sr-only">Date</label>
    <input type="text" class="form-control masked" name="search_start_date" id="search_start_date" placeholder="开始日期" value="<?php echo Yii::$app->request->get('search_start_date', date('Ymd', time() - 864000));?>" data-mask="9999-99-99" />
    -
    <input type="text" class="form-control masked" name="search_end_date" id="search_end_date" placeholder="结束日期" value="<?php echo Yii::$app->request->get('search_end_date', date('Ymd'));?>" data-mask="9999-99-99" />
</div>
<div class="form-group">
    <label for="search_split" class="sr-only">Split</label>
    <?php echo Html::radioList('search_split', Yii::$app->request->get('search_split', 'day'), ['day'=>'日', 'week'=>'周', 'month'=>'月', 'season'=>'季', 'year'=>'年']);?>
</div>
<div class="form-group">
    <label for="search_cid" class="sr-only">Cid</label>
    <?php echo Html::dropDownList('search_cid', Yii::$app->request->get('search_cid'), [null=>'选择分类'] + ArticleCategory::list4Options(), ['class'=>'form-control']);?>
</div>
<div class="form-group">
    <button type="submit" class="btn btn-primary btn-sm">搜索</button>
</div>
<?php echo Html::endForm();?>
<div id="main" style="width: 100%;height:400px;"></div>
<div id="category" style="width: 100%;height:400px;"></div>
<script type="text/javascript">
    /**
     * 显示访问统计图表
     */
    function showCharts() {
        var myChart = echarts.init(document.getElementById('main'), 'macarons');
        var option = {
            title: {
                text: '访问数量'
            },
            legend: {
                data:['数量']
            },
            xAxis: {
                data: <?php echo json_encode(array_column($table, 'date'));?>
            },
            yAxis: {},
            series: [{
                name: '数量',
                type: 'bar',
                data: <?php echo json_encode(array_column($table, 'num'));?>
            }]
        };
        myChart.setOption(option);
    }
    /**
     * 显示分类统计图表
     */
    function showCategory() {
        var myChart = echarts.init(document.getElementById('category'), 'macarons');
        var option = {
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b}: {c} ({d}%)"
            },
            legend: {
                orient: 'vertical',
                x: 'left',
                data:<?php echo json_encode(ArrayHelper::getColumn($category, 'cname'));?>
            },
            series: [
                {
                    name:'访问分类',
                    type:'pie',
                    selectedMode: 'single',
                    radius: [0, '30%'],
                    label: {
                        normal: {
                            position: 'inner'
                        }
                    },
                    labelLine: {
                        normal: {
                            show: false
                        }
                    }
                },
                {
                    name:'访问来源',
                    type:'pie',
                    radius: ['40%', '55%'],
                    data:<?php $_data = [];foreach ($category as $item) {$_data[] = ['name'=>$item['cname'], 'value'=>$item['num']];}echo json_encode($_data);?>
                }
            ]
        };
        myChart.setOption(option);
    }
</script>
<?php $this->registerJs('showCharts();showCategory();');?>
